import React, { Component } from 'react';
import MyTypes from './components/Mytypes'
import MySearch from '@/components/search/Search'
import TabList from './components/TabList'
import {getCateApi} from '@api/cateApi';
class Category extends Component {
  state={
    category:{},//分类
    material:{},//食材
    arr:{},//传递的对象
    btn:'热门'
  }
  componentDidMount(){
    getCateApi().then(res=>{
    //  console.log(res);
     this.setState({
       category:res.data.category,
       material:res.data.material,
       arr:res.data.category
     })
    })
  }
  changeBtn=(val)=>{
  this.setState({
    arr:val=='category'?this.state.category:this.state.material,
    btn:val=='category'?'热门':'肉类'
  })
  }
  render() {
    return (
      <div>
        {/* 头部 */}
        <MyTypes changeBtn={this.changeBtn}/>
        {/* 搜索 */}
        <MySearch bg="#fff" noBorder="true" inbg="#F4F4F4"/>
        {/* tab列表 */}
        <TabList obj={this.state.arr} btn={this.state.btn}/>
      </div>
    );
  }
}

export default Category;
